<template>
  <div>
    <h1>组件使用 v-model</h1>
    <!-- v-model 给组件用时, 就是给组件绑定了 value 属性和 input 事件 -->
    <!-- 属性名和事件名由 v-model 内部决定的, 我们不能随便修改 -->
    <MyProduct 
      title="好兄弟卖包子" 
      info="好吃肉馅大皮儿薄" 
      :value="money" 
      @input="money = $event" />
    <MyProduct 
      title="好兄弟卖包子" 
      info="好吃肉馅大皮儿薄" 
      v-model="money" />
  </div>
</template>

<script>
import MyProduct from './components/MyProduct.vue'
export default {
  components: {
    MyProduct
  },
  data() {
    return {
      money: 29
    }
  }
}
</script>

<style>

</style>